<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>模板引擎2</title>
		<script type="text/javascript" src="art-template-master/art-template-master/lib/template-web.js"></script>

		<script type="text/html" id="template">
			<h1>{{title}}</h1>
			{{if books}}
			     {{each books as value i}}
			       <div>{{value}}</div>
			     {{/each}}
			{{/if}}
		</script>
		<script type="text/javascript">
		window.onload=function(){
			var data={
				title:'图书信息',
				books:['三国演义','水浒传','西游记','红楼梦']
			};
//			trtmplate的作用就是把模板和数据拼接到一块生成一个静态页面
//          参数1:模板id
//          参数2:用来渲染的数据
			var html=template('template',data);
			var con=document.getElementById('container');
			con.innerHTML = html;
		}
		</script>
	</head>
	<body>
		<div id="container"></div>
	</body>
</html>
